<template>
  <a-upload v-model:file-list="fileList" name="file" :max-count="1" :action="apiURL + '/app/file/upload'"
    @change="handleChange" @remove="removebtn">
    <a-button>
      <upload-outlined></upload-outlined>
      上传文件
    </a-button>
  </a-upload>
</template>
<script setup>
import { message } from 'ant-design-vue';
import { computed, ref } from 'vue';
import { useAppConfig } from '@vben/hooks';
import { PlusOutlined, LoadingOutlined, UploadOutlined } from '@ant-design/icons-vue';
const { apiURL } = useAppConfig(import.meta.env, import.meta.env.PROD);



const props = defineProps({
  value: {
    type: Array,
    default: () => []
  },
});
const emits = defineEmits(['update:value']);


const files = computed({
  get() {
    return props.value;
  },
  set(val) {
    emits('update:value', val);
  },
});


console.log('回显', files.value);

const fileList = ref(files.value)



const handleChange = info => {
  if (info.file.status !== 'uploading') {
    console.log(info.file, info.fileList);
  }
  if (info.file.status === 'done') {
    console.log('上传成功', info);


    // fileList.value = [info.file?.response]
    console.log('上传成功', fileList.value);
    files.value = [info.file?.response]


  } else if (info.file.status === 'error') {
    message.error(`${info.file.name} file upload failed.`);
  }
};

const removebtn = (e) => {
  files.value = []
}

const headers = {
  authorization: 'authorization-text',
};
</script>
